<template>
  <div id="centerRight1">
    <div class="bg-color-black">
      <div class="d-flex jc-center body-box">
        <dv-scroll-board
          :config="config"
          style="width:280px;height:230px"
        />
      </div>
    </div>
  </div>
</template>

<script>
	export default {
		props: {
			dateStr: {
				type: String,
				default: ""
			},
		},
		data() {
			return {
				url: {
					dianRank: '/api/report/analysis/dianRank',
				},
				config: {

				}

			}
		},
		mounted() {
			this.getYdRank()
		},
		methods: {
			getYdRank() {
				var _this = this
				this.$ajax({
					method: 'get',
					url: this.url.dianRank,
					params: {
						dateStr: this.dateStr
					}
				}).then(function(resultData) {
					var resData = resultData.data.data
					var resList = resData.list
					var data = []
					for (let i = 0; i < resList.length; i++) {
						data.push([resList[i].fieldName, resList[i].sumValue])
					}
					_this.config = {
						header: ['设备名称', '电量'],
						data: data,
						rowNum: 5, //表格行数
						headerHeight: 35,
						headerBGC: '#0f1325', //表头
						oddRowBGC: '#0f1325', //奇数行
						evenRowBGC: '#171c33', //偶数行
						index: true,
						align: ['center'],
						columnWidth: [35, 170, 80]

					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	// $box-height: 890px;
	// $box-width: 300px;
	// #centerRight1 {
	//   padding: 16px;
	//   padding-top: 20px;
	//   height: $box-height;
	//   width: $box-width;
	//   border-radius: 5px;
	//   .bg-color-black {
	//     height: $box-height - 30px;
	//     border-radius: 10px;
	//   }
	//   .text {
	//     color: #c3cbde;
	//   }
	//   .body-box {
	//     border-radius: 10px;
	//     overflow: hidden;
	//     .dv-scr-board {
	//       width: 270px;
	//       height: 340px;
	//     }
	//   }
	// }
</style>
